<style lang="less">
</style>
<template>
  <div>
    <h3>剩余积分：{{ currentRemainIntegral }}  </h3>
    <h3>活动列表</h3>
    <Table
      border highlight-row
      :columns="columns" :data="tableData"></Table>
    <h3>已参加活动</h3>
    <Table
      border highlight-row
      :columns="columns1" :data="tableData1"></Table>
  </div>
</template>
<script>
import { getUserList, updateUser } from '@/api/users'
import { getActivityList } from '@/api/activity'
import { getUserActivityList, addUserActivity } from '@/api/user_activity'

export default {
  components: {
  },
  data () {
    return {
      tableData: [],
      tableData1: [],
      currentRemainIntegral: 0,
      columns: [{
        type: 'index',
        width: 60,
        align: 'center'
      }, {
        title: '活动名称',
        key: 'name'
      }, {
        title: '需要积分',
        key: 'integral'
      }, {
        title: 'Action',
        key: 'action',
        width: 150,
        align: 'center',
        render: (h, params) => {
          return h('div', [
            h('Button', {
              props: {
                type: 'primary',
                size: 'small'
              },
              style: {
                marginRight: '5px'
              },
              on: {
                click: () => {
                  this.btnAddClick(params)
                }
              }
            }, '参加')
          ])
        }
      }],
      columns1: [{
        type: 'index',
        width: 60,
        align: 'center'
      }, {
        title: '活动名称',
        key: 'activityname'
      }, {
        title: '花费积分',
        key: 'integral'
      }, {
        title: '报名时间',
        key: 'create_time'
      }]
    }
  },
  created () {
    this.getList()
    this.getHistery()
    this.refreshIntegral()
  },
  methods: {
    refreshIntegral () {
      getUserList({id: localStorage.userid}).then(({data}) => {
        console.log(data)
        this.currentRemainIntegral = data.integral === null ? 0 : data.integral
      })
    },
    getHistery () {
      let param = { userid: localStorage.userid }
      getUserActivityList(param).then(res => {
        this.tableData1 = res.data.rows
      })
    },
    getList () {
      getActivityList().then(res => {
        this.tableData = res.data.rows
      })
    },
    btnAddClick (params) {
      params = params.row
      updateUser(localStorage.userid, { integral: this.currentRemainIntegral - params.integral })

      let param = { userid: localStorage.userid,
        activityid: params.id,
        integral: params.integral,
        activityname: params.name}
      addUserActivity(param).then(data => {
        this.refreshIntegral()
        this.getHistery()
      })
    }
  }
}

</script>
<style>
</style>
